<template>
  <el-container class="main_con proAdd main-loading"  v-loading="isLoading" element-loading-background="rgba(255, 255, 255, 1)">
    <div class="list_con nomt nopt" style="padding-bottom:0;">
      <div class="lcc">
        <el-tabs v-model="activeName" @tab-click="tabsClick">
          <el-tab-pane label="基本" name="p1">
            <div class="edit_con">
              <div class="edit_content nomt" style="border-bottom:0">
                <el-form size="medium" label-width="100px" ref="shForm" :model="obj" :rules="itemRules" class="edit_form" style="width:100%">
                  <el-form-item label="商品类型">
                    <el-radio-group :disabled="isEdit" v-model="obj.type">
                      <el-radio class="square" :label="0">实体商品</el-radio>
                      <!-- <el-radio disabled class="square" :label="1">虚拟商品</el-radio> -->
                    </el-radio-group>
                  </el-form-item>
                  <el-divider></el-divider>
                  <el-form-item label="商品名称" prop="name">
                    <el-input placeholder="请输入商品名称" maxlength="32" show-word-limit v-model="obj.name" style="width:300px;"></el-input>
                  </el-form-item>

                  <el-form-item label="商品副标题" prop="subtitle">
                    <el-input placeholder="请输入商品副标题" maxlength="32" show-word-limit v-model="obj.subtitle" style="width:300px"></el-input>
                  </el-form-item>

                  <el-form-item label="商品主图" prop="master">
                    <div style="width:100px;height:100px;"><Upload :tempUrl="obj.master" @input="getImage"></Upload></div>
                    <el-checkbox :disabled="obj.master == ''" v-model="obj.cover">添加到商品轮播图</el-checkbox>
                  </el-form-item>

                  <el-form-item label="商品轮播图" prop="slideshow"><UploadMulti :obj="obj"></UploadMulti></el-form-item>

                  <el-form-item label="所属分类" prop="classify_id">
                    <el-cascader v-model="classify_id" ref="cateCal" :options="cateList" :props="{multiple: true, checkStrictly: true}" clearable></el-cascader>
                  </el-form-item>
                  <el-form-item label="商品排序" v-if="ismall"><el-input v-model="obj.sort" style="width:80px"></el-input></el-form-item>

                  <el-form-item label="启用虚拟销量" v-if="ismall">
                    <el-radio-group v-model="obj.is_virtual">
                      <el-radio :label="0">关闭</el-radio>
                      <el-radio :label="1">启用</el-radio>
                    </el-radio-group>
                    <div style="color:#909399;font-size:12px;">开启之后,显示销量=实际销量+虚拟销量</div>
                  </el-form-item>

                  <el-form-item label="虚拟销量" v-if="obj.is_virtual == 1"><el-input v-model="obj.virtual_sell" style="width:80px"></el-input></el-form-item>
                  <el-form-item label="商品限购"><el-switch :active-value="1" :inactive-value="0" v-model="obj.is_limitation"></el-switch></el-form-item>

                  <el-form-item label="库存类型" v-if="obj.is_limitation == 1">
                    <el-radio-group v-model="obj.limitation_type">
                      <el-radio :label="1">单笔限购</el-radio>
                      <el-radio :label="2">历史限购</el-radio>
                    </el-radio-group>
                  </el-form-item>

                  <el-form-item label="限购数量" v-if="obj.is_limitation == 1"><el-input v-model="obj.limitation" style="width:80px"></el-input></el-form-item>

                  <el-form-item label="库存类型">
                    <el-radio-group class="inventory" v-model="obj.inventory_type">
                      <el-radio :label="1">
                        下单前减库存
                        <img class="radio_icon_img" src="@/assets/images/tuijian.png" />
                      </el-radio>
                      <el-radio :label="2">
                        永不减库存
                        <i class="radio_icon el-sc-risk" style="color: #FF0000;"></i>
                      </el-radio>
                      <el-radio :label="3">付款减库存</el-radio>
                    </el-radio-group>
                    <div v-if="obj.inventory_type == 1" style="color:#909399;font-size:12px;">买家提交订单, 扣减库存数量, 可能会存在 恶意占用库存风险</div>
                    <div v-if="obj.inventory_type == 3" style="color:#909399;font-size:12px;">买家支付成功, 扣减库存数量, 可能会存在超卖风险</div>
                    <div v-if="obj.inventory_type == 2" style="color:#909399;font-size:12px;">无论在下单还是在支付成功, 该商品永远不会扣减库存数量</div>
                  </el-form-item>
                  <el-form-item label="商品标签">
                    <el-tag :key="tag" v-for="tag in obj.label" closable :disable-transitions="false" @close="handleClose(tag)">{{ tag }}</el-tag>
                    <el-input
                      class="input-new-tag"
                      v-if="inputVisible"
                      v-model="inputValue"
                      ref="saveTagInput"
                      size="small"
                      @keyup.enter.native="handleInputConfirm"
                      @blur="handleInputConfirm"
                    ></el-input>
                    <el-button v-else class="button-new-tag" size="small" @click="showInput">添加</el-button>
                  </el-form-item>
                  <el-form-item label="退换货类型">
                    <el-checkbox-group v-model="obj.retreat">
                      <el-checkbox :label="'1'">退款</el-checkbox>
                      <el-checkbox :label="'2'">退货退款</el-checkbox>
                      <el-checkbox :label="'3'">换货</el-checkbox>
                    </el-checkbox-group>
                  </el-form-item>
                  <el-form-item label="商品表单" v-if="formlist.length > 0">
                    <el-radio-group v-model="obj.form_open">
                      <el-radio :label="1">开启</el-radio>
                      <el-radio :label="0">关闭</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-form-item label="选择表单" v-if="obj.form_open">
                    <el-select v-model="obj.template_id" placeholder="请选择">
                      <el-option v-for="item in formlist" :key="item.id" :label="item.title" :value="item.id"></el-option>
                    </el-select>
                  </el-form-item>
                  <el-divider></el-divider>

                  <!-- <el-form-item label="会员商品" v-model="obj.is_open_member_price">
                    <el-radio-group>
                      <el-radio :label="1">是</el-radio>
                      <el-radio :label="1">否</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-form-item label="会员价类型" v-model="obj.member_price_type">
                    <el-radio-group>
                      <el-radio :label="1">系统默认</el-radio>
                      <el-radio :label="2">折扣</el-radio>
                      <el-radio :label="3">固定价格</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-form-item label="折扣价格" v-model="obj.is_open_member_price">
                    <el-radio-group>
                      <el-radio :label="1">是</el-radio>
                      <el-radio :label="1">否</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-divider></el-divider> -->

                  <el-form-item label="商品分享图">
                    <div style="width:100px;height:100px;"><Upload :tempUrl="obj.share" @input="getImageShare"></Upload></div>
                  </el-form-item>

                  <el-divider></el-divider>

                  <span v-if="obj.has_sku == 0">
                    <el-form-item label="默认售价"><el-input v-model="obj.sell_price" style="width:80px"></el-input></el-form-item>
                    <el-form-item label="默认划线价"><el-input v-model="obj.original_price" style="width:80px"></el-input></el-form-item>
                    <el-form-item v-if="isEdit" label="剩余库存"><el-input v-model="obj.total" style="width:80px"></el-input></el-form-item>
                    <el-form-item v-else label="默认库存"><el-input v-model="obj.total" style="width:80px"></el-input></el-form-item>
                    <el-form-item label="默认重量"><el-input v-model="obj.weight" style="width:80px"></el-input></el-form-item>
                    <el-form-item label="商品编码"><el-input v-model="obj.code" style="width:80px"></el-input></el-form-item>
                    <el-form-item label="成本价"><el-input v-model="obj.cost_price" style="width:80px"></el-input></el-form-item>
                  </span>
                  <el-form-item label="提取方式">
                    <el-checkbox-group v-model="obj.deliver">
                      <el-checkbox :label="'1'">快递</el-checkbox>
                      <el-checkbox v-has="11" :label="'2'">自提</el-checkbox>
                      <el-checkbox v-has="16" :label="'3'">同城</el-checkbox>
                    </el-checkbox-group>
                    <div v-if="storeList != 0" style="color:#909399;font-size:12px;">默认三种类型都支持</div>
                  </el-form-item>

                  <el-form-item label="门店库存" v-if="false">
                    <el-radio-group :disabled="isEdit" v-model="obj.is_store_inventory">
                      <el-radio :label="0">关闭</el-radio>
                      <el-radio :label="1">开启</el-radio>
                    </el-radio-group>
                    <div class="gray_area store_inventory" v-if="obj.is_store_inventory == 1 && obj.has_sku == 0">
                      <ul>
                        <li v-for="(item, i) in obj.store_inventory" :key="i">
                          <el-select v-model="item.store_id" filterable placeholder="请选择门店" style="flex:1">
                            <el-option v-for="sitem in storeList" :key="sitem.id" :label="sitem.name" :value="sitem.id"></el-option>
                          </el-select>

                          <el-input v-model="item.total" size="medium" placeholder="库存" style="width:100px;margin-left:20px"></el-input>

                          <el-button type="text" style="margin-left:20px" @click="removeStoreInventory(i)">删除</el-button>
                        </li>
                        <li class="addMore" @click="addStoreInventory">添加更多</li>
                      </ul>
                    </div>
                  </el-form-item>

                  <el-form-item label="多规格">
                    <el-radio-group v-model="obj.has_sku">
                      <el-radio :label="0">关闭</el-radio>
                      <el-radio :label="1">开启</el-radio>
                    </el-radio-group>
                    <div class="gray_area sku_setting" v-if="obj.has_sku == 1">
                      <div class="sku_attr">
                        <div class="attr_bk" v-for="(item, i) in obj.sku_value" :key="i">
                          <i class="icon-abl-close-bk el-icon-error" @click="removeSkuItem(i)"></i>
                          <div class="attr_name">
                            <el-input v-model="item.name" placeholder="如颜色、尺码、大小" style="width:180px" @keyup.enter.native="formatSkuData" @blur="formatSkuData"></el-input>
                            <el-checkbox v-model="item.has_pic" @change="usePic(i)" :true-label="1" :false-label="0" style="margin-left:20px;line-height:0">添加图片</el-checkbox>
                          </div>
                          <div class="attr_list">
                            <div class="line"><span class="line_bk"></span></div>
                            <ul>
                              <li v-for="(sitem, l) in item.attrValue" :key="l">
                                <i class="icon-abl-close el-icon-error" @click="removeSkuValue(i, l)"></i>
                                <el-input
                                  v-model="sitem.value"
                                  placeholder="子规格,如L、M"
                                  style="width:180px"
                                  @keyup.enter.native="formatSkuData"
                                  @blur="formatSkuData"
                                ></el-input>
                              </li>
                              <li class="addItem" @click="addSkuValue(i)">+添加规格值</li>
                            </ul>
                          </div>
                        </div>

                        <div v-if="obj.sku_value.length < 3" class="attr_bk addBk" @click="addSkuItem">+添加规格项</div>
                      </div>
                      <div class="sku_num_all">
                        <div class="l_title">批量设置：</div>
                        <el-input placeholder="销售价" v-model="set_all.sell_price" style="width:180px;margin-right:20px;"></el-input>
                        <el-input placeholder="划线价" v-model="set_all.original_price" style="width:180px;margin-right:20px;"></el-input>
                        <el-input placeholder="重量" v-model="set_all.weight" style="width:180px;margin-right:20px;"></el-input>
                        <el-input v-if="!obj.is_store_inventory" placeholder="库存" v-model="set_all.total" style="width:180px;margin-right:20px;"></el-input>
                        <el-input placeholder="商品编码" v-model="set_all.code" style="width:180px;margin-right:20px;"></el-input>
                        <el-input placeholder="成本价" v-model="set_all.cost_price" style="width:180px;margin-right:20px;"></el-input>

                        <el-button style="margin-right:10px;" @click="setAll">应用</el-button>
                        <el-button v-if="obj.is_store_inventory" @click="buildStoreNumAll">批量设置门店库存</el-button>
                      </div>
                      <div class="sku_set">
                        <el-table :data="tabledata" :span-method="arraySpanMethod" :key="rk">
                          <template v-for="(item, i) in keylist">
                            <el-table-column v-if="item == '图片'" :prop="'k' + i" :key="i" :label="item">
                              <template slot-scope="scope">
                                <div style="width:40px;height:40px;"><Upload :tempUrl="scope.row.pic" @input="getSkuImage($event, i, scope.$index)"></Upload></div>
                              </template>
                            </el-table-column>
                            <el-table-column v-if="item != '图片'" :prop="'k' + i" :key="i" :label="item"></el-table-column>
                          </template>
                          <el-table-column label="销售价(元)">
                            <template slot-scope="scope">
                              <el-input v-model="scope.row.sell_price"></el-input>
                            </template>
                          </el-table-column>
                          <el-table-column label="划线价(元)">
                            <template slot-scope="scope">
                              <el-input v-model="scope.row.original_price"></el-input>
                            </template>
                          </el-table-column>
                          <el-table-column label="重量(g)">
                            <template slot-scope="scope">
                              <el-input v-model="scope.row.weight"></el-input>
                            </template>
                          </el-table-column>
                          <el-table-column label="库存(件)" v-if="!obj.is_store_inventory">
                            <template slot-scope="scope">
                              <div style="display:flex;align-items: center;">
                                <el-input v-model="scope.row.total"></el-input>
                                <!-- <div v-if="isEdit" style="padding-left:10px">实时库存:{{scope.row.tsum}}</div> -->
                              </div>
                            </template>
                          </el-table-column>
                          <el-table-column label="商品编码">
                            <template slot-scope="scope">
                              <el-input v-model="scope.row.code"></el-input>
                            </template>
                          </el-table-column>
                          <el-table-column label="成本价">
                            <template slot-scope="scope">
                              <el-input v-model="scope.row.cost_price"></el-input>
                            </template>
                          </el-table-column>

                          <el-table-column label="操作" v-if="obj.is_store_inventory">
                            <template slot-scope="scope">
                              <el-button @click="buildStoreNum(scope)"></el-button>
                            </template>
                          </el-table-column>
                        </el-table>
                      </div>
                    </div>
                  </el-form-item>
                  <el-form-item label="附加属性">
                    <el-radio-group v-model="obj.has_attach">
                      <el-radio :label="1">开启</el-radio>
                      <el-radio :label="0">关闭</el-radio>
                    </el-radio-group>
                    <template v-if="obj.has_attach">
                      <el-button type="text" @click="addattach">添加属性</el-button>
                      <div style="color:#909399;font-size:12px;">商品应付价格=商品基本价格+附加规格价格,附加规格库存只代表该附加规格</div>
                      <div class="attach" v-for="(item, i) in attachlist" :key="i">
                        <i class="icon-abl-close el-icon-error" @click="removeattach(i)"></i>
                        <div class="u-flex attachtitle">
                          <div class="u-label"><span>属性名</span></div>
                          <el-input v-model="item.name"></el-input>
                          <!-- <''el-checkbox v-model="item.need" :true-label="1" :false-label="0" style="margin-right:20px;line-height:0">必选</el-checkbox> -->
                          <div class="toplimit">
                            <span>选择下限</span>
                            <el-input-number size="mini" :min="0" v-model="item.need" :max="item.toplimit"></el-input-number>
                          </div>

                          <div class="toplimit">
                            <span>选择上限</span>
                            <el-input-number size="mini" :min="1" v-model="item.toplimit" :max="item.list.length"></el-input-number>
                          </div>

                          <el-button type="text" @click="addattachitem(i)">添加规格</el-button>
                        </div>
                        <div class="u-flex " v-for="(data, index) in item.list" :key="index">
                          <div class="u-flex">
                            <div class="u-label"><span>规格名</span></div>
                            <el-input v-model="data.name"></el-input>
                          </div>
                          <div class="u-flex">
                            <div class="u-label"><span>附加价格</span></div>
                            <el-input v-model="data.price"></el-input>
                          </div>
                          <div class="u-flex">
                            <div class="u-label"><span>库存</span></div>
                            <el-input v-model="data.total"></el-input>
                          </div>
                          <el-button @click="removeattachitem(i, index)" type="text">删除</el-button>
                        </div>
                      </div>
                    </template>
                  </el-form-item>

                  <el-divider></el-divider>

                  <el-form-item label="运费设置">
                    <el-radio-group v-model="obj.ft_type">
                      <el-radio :label="0">包邮</el-radio>
                      <el-radio :label="1">选择模板</el-radio>
                      <el-radio :label="2">统一运费</el-radio>
                    </el-radio-group>
                    <div class="gray_area" v-if="obj.ft_type == 1">
                      <el-select v-model="obj.ft_id" placeholder="请选择运费模板">
                        <el-option v-for="item in freightList" :key="item.id" :label="item.name" :value="item.id"></el-option>
                      </el-select>
                      <el-button type="text" style="margin-left:10px;" @click="refreshFreight">刷新</el-button>
                      <!-- <el-button type="text" @click="addFreight">添加模板</el-button> -->
                      <router-link tag="a" target="_blank" to="/product/freight/list" style="margin-left:10px"><el-button type="text">添加模板</el-button></router-link>
                    </div>
                    <div class="gray_area" v-if="obj.ft_type == 2">
                      <el-input v-model="obj.ft_price" placeholder="请输入统一运费" style="width:300px">
                        <template slot="append">
                          元
                        </template>
                      </el-input>
                      <div style="color:#909399;font-size:12px;">如果开启了同城配送,同城运费根据统一邮费进行计算</div>
                    </div>
                  </el-form-item>
                  <el-form-item><div style="color:#909399;font-size:12px;">新增商品后，默认在仓库中</div></el-form-item>
                </el-form>
              </div>
            </div>
          </el-tab-pane>
          <el-tab-pane label="详情" name="p2" style="padding:10px 2px 0 0;">
            <div class="detial_div">
              <div>
                <span class="title">商品详情预览</span>
                <div v-html="obj.content" class="content_div"></div>
              </div>

              <tinymce v-model="obj.content" :height="600" />
            </div>
          </el-tab-pane>
          <el-tab-pane label="参数" name="p3">
            <div class="edit_con">
              <div class="edit_content nomt" style="border-bottom:0">
                <el-form size="medium" label-width="100px" class="edit_form" style="width:100%">
                  <el-form-item label="商品参数">
                    <el-switch :active-value="1" :inactive-value="0" v-model="obj.has_parameter"></el-switch>
                    <div class="proPrams" v-if="obj.has_parameter == 1">
                      <dl>
                        <dt>
                          <div class="dks drag"></div>
                          <div class="dks ins">参数名称</div>
                          <div class="dks ins">参数值</div>
                          <div class="dks cbs">操作</div>
                        </dt>
                        <draggable element="ul" v-model="obj.parameter">
                          <dd v-for="(item, i) in obj.parameter" :key="i">
                            <div class="dks drag"><i class="el-icon-d-caret"></i></div>
                            <div class="dks ins"><el-input size="small" v-model="item.key"></el-input></div>
                            <div class="dks ins"><el-input size="small" v-model="item.value"></el-input></div>
                            <div class="dks cbs"><el-button type="text" @click="removeParameter(i)">删除</el-button></div>
                          </dd>
                        </draggable>
                        <dd class="ap">
                          <div class="dks ins"><el-button type="text" @click="addParameter">添加商品参数</el-button></div>
                        </dd>
                      </dl>
                    </div>
                  </el-form-item>
                </el-form>
              </div>
            </div>
          </el-tab-pane>
          <el-tab-pane label="积分" name="p5" v-if="isintegralopen && ismall">
            <div class="edit_con">
              <div class="edit_content nomt" style="border-bottom:0">
                <el-form size="medium" label-width="100px" class="edit_form" style="width:100%">
                  <el-form-item v-has="15" label="购物积分">
                    <el-radio-group v-model="obj.is_integral">
                      <el-radio :label="1">参与</el-radio>
                      <el-radio :label="0">不参与</el-radio>
                    </el-radio-group>
                    <div style="color:#909399;font-size:12px;">如果不参与积分，购买该商品则不获得积分</div>
                  </el-form-item>
                  <el-form-item v-has="15" label="购物积分设置" v-if="obj.is_integral == 1">
                    <el-radio-group v-model="is_base_integral">
                      <el-radio :label="0">系统设置</el-radio>
                      <el-radio :label="1">按商品设置</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-form-item v-has="15" label="购买获得积分" v-if="obj.is_integral == 1 && is_base_integral == 1">
                    <el-input v-model="obj.integral" style="width:300px;"></el-input>
                  </el-form-item>
                  <el-form-item label="积分抵扣">
                    <el-radio-group v-model="obj.my_integral_deduction">
                      <el-radio :label="0">关闭</el-radio>
                      <el-radio :label="1">不限制抵扣数量</el-radio>
                      <el-radio :label="2">自定义最多抵扣</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-form-item label v-if="obj.my_integral_deduction == 2">
                    <div class="fks">
                      最多抵扣：
                      <el-input v-model="obj.integral_maximum" style="width:180px;margin-right:10px;margin-left:10px;">
                        <template slot="append">
                          元
                        </template>
                      </el-input>
                    </div>
                  </el-form-item>
                </el-form>
              </div>
            </div>
          </el-tab-pane>
          <el-tab-pane label="分销" name="p7" v-if="ismall">
            <div class="edit_con">
              <div class="edit_content nomt" style="border-bottom:0">
                <el-form size="medium" label-width="100px" class="edit_form" style="width:100%">
                  <el-form-item label="参与分销">
                    <el-radio-group v-model="obj.is_distribution">
                      <el-radio :label="0">不参与</el-radio>
                      <el-radio :label="1">参与</el-radio>
                    </el-radio-group>
                    <div style="color:#909399;font-size:12px;">如果不参与分销，则不产生分销佣金</div>
                  </el-form-item>
                  <el-form-item label="佣金设置" v-if="obj.is_distribution == 1">
                    <el-radio-group v-model="obj.is_base_distribution">
                      <el-radio :label="0">系统设置</el-radio>
                      <el-radio :label="1">按商品设置</el-radio>
                    </el-radio-group>
                    <div class="gray_area distribution" v-if="obj.is_base_distribution == 1">
                      <div class="setting_area">
                        <div class="setStyle"></div>
                        <div class="setStyle tc" v-if="agent_rank > 0">一级分销商</div>
                        <div class="setStyle tc" v-if="agent_rank > 1">二级分销商</div>
                        <div class="setStyle tc" v-if="agent_rank > 2">三级分销商</div>
                      </div>
                      <div class="setting_area" v-for="(data, index) in gradelist" :key="index">
                        <div class="setStyle">{{ data.name }}</div>
                        <div class="setStyle" v-for="(item, i) in data.distribution" :key="i" v-if="i < agent_rank">
                          <el-select v-model="item.type" slot="prepend" placeholder="请选择" style="width:110px">
                            <el-option label="佣金比例" :value="0"></el-option>
                            <el-option label="固定佣金" :value="1"></el-option>
                          </el-select>
                          <el-input placeholder v-model="item.figure" class="input-with-select"></el-input>
                          <span>{{ item.type == 0 ? '%' : '元' }}</span>
                        </div>
                      </div>
                    </div>
                  </el-form-item>
                </el-form>
              </div>
            </div>
          </el-tab-pane>
          <el-tab-pane label="会员价" name="p8" v-if="ismall && isvip">
            <div class="edit_con">
              <div class="edit_content nomt" style="border-bottom:0">
                <el-form size="medium" label-width="100px" class="edit_form" style="width:100%">
                  <el-form-item label="会员折扣">
                    <el-radio-group v-model="obj.level_price_type">
                      <el-radio :label="0">不参与</el-radio>
                      <el-radio :disabled="MembershipList.length == 0" :label="2">系统默认</el-radio>
                      <el-radio :disabled="MembershipList.length == 0" :label="1">根据会员等级</el-radio>
                    </el-radio-group>
                    <template v-if="obj.level_price_type == 1 && MembershipList.length > 0">
                      <div class="bg" v-if="obj.has_sku == 0" style="margin-top: 20px;">
                        <div class="member_price" v-for="(value, i) in obj.level_price.price">
                          <div class="member_title">{{ MembershipList[i].name }}</div>

                          <el-input size="small" placeholder v-model="value.price" class="member_input">
                            <el-select size="small" slot="prepend" v-model="value.type" placeholder="请选择" style="width:80px;background:#2E68EA;color: #FFFFFF;">
                              <el-option label="价格" :value="1"></el-option>
                              <el-option label="折扣" :value="2"></el-option>
                            </el-select>
                            <span slot="append" icon="el-icon-search">{{ value.type == 1 ? '元' : '折' }}</span>
                          </el-input>
                          <!-- <span></span> -->
                        </div>
                      </div>
                      <div class="sku_num_all" v-if="obj.has_sku == 1">
                        <div class="l_title">批量设置：</div>
                        <div class="member_price">
                          <el-input placeholder v-model="MembershipList[a_id].price" class="member_input_long">
                            <el-select style="width: 120px;background:#ff9000;color: #FFFFFF;" v-model="a_id" slot="prepend">
                              <el-option v-for="(item, i) in MembershipList" :key="i" :label="item.name" :value="i"></el-option>
                            </el-select>
                            <el-select slot="append" v-model="MembershipList[a_id].type" placeholder="请选择" style="width:80px;background:#2E68EA;color: #FFFFFF;">
                              <el-option label="价格" :value="1"></el-option>
                              <el-option label="折扣" :value="2"></el-option>
                            </el-select>
                          </el-input>
                          <el-button size="small" style="margin-left:10px;" @click="setAlllevelprice">应用</el-button>
                          <!-- <span>{{ value.type == 1 ? '元' : '折' }}</span> -->
                        </div>
                      </div>
                      <div class="sku_set" v-if="obj.has_sku == 1">
                        <el-table size="small" :data="tabledata" :span-method="arraySpanMethod" :key="rk">
                          <template v-for="(item, i) in keylist">
                            <el-table-column v-if="item == '图片'" :prop="'k' + i" :key="i" :label="item" fixed>
                              <template slot-scope="scope">
                                <div style="width:40px;height:40px;"><Upload :tempUrl="scope.row.pic" @input="getSkuImage($event, i, scope.$index)"></Upload></div>
                              </template>
                            </el-table-column>
                            <el-table-column fixed v-if="item != '图片'" :prop="'k' + i" :key="i" :label="item"></el-table-column>
                          </template>
                          <el-table-column v-for="(data, index) in MembershipList" :key="index + 'i'" :label="data.name" width="250px">
                            <template slot-scope="scope">
                              <div class="member_price">
                                <el-input size="small" placeholder v-model="scope.row.level_price.price[index].price" class="member_input">
                                  <el-select
                                    v-model="scope.row.level_price.price[index].type"
                                    slot="prepend"
                                    placeholder="请选择"
                                    style="width:80px;background:#2E68EA;color: #FFFFFF;"
                                  >
                                    <el-option label="价格" :value="1"></el-option>
                                    <el-option label="折扣" :value="2"></el-option>
                                  </el-select>
                                  <span slot="append" icon="el-icon-search">{{ scope.row.level_price.price[index].type == 1 ? '元' : '折' }}</span>
                                </el-input>
                                <!-- <span>{{ scope.row.level_price[index].type == 1 ? '元' : '折' }}</span> -->
                              </div>
                            </template>
                          </el-table-column>
                        </el-table>
                      </div>
                    </template>
                    <div style="color:#909399;font-size:12px;">
                      <router-link tag="a" target="_blank" to="/vipcenter/list" style="margin-left:10px"><el-button type="text">新增会员等级</el-button></router-link>
                    </div>
                  </el-form-item>
                </el-form>
              </div>
            </div>
          </el-tab-pane>
        </el-tabs>
      </div>
      <div class="edit_footer" v-if="!onlyShow">
        <el-button v-if="isCopy" size="medium" type="primary" @click="saveData">提交数据</el-button>
        <el-button v-else size="medium" type="primary" @click="saveData">保存数据</el-button>
      </div>
    </div>

    <el-dialog title="门店库存设置" :visible.sync="showStoreInventory" width="540px">
      <div class="gray_area store_inventory" style="margin-top:0;">
        <ul v-if="tabledata[currentSku]">
          <li v-for="(item, i) in tabledata[currentSku].store_inventory" :key="i">
            <el-select v-model="item.store_id" filterable placeholder="请选择门店" style="flex:1">
              <el-option v-for="sitem in storeList" :key="sitem.id" :label="sitem.name" :value="sitem.id"></el-option>
            </el-select>

            <el-input v-model="item.total" size="medium" placeholder="库存" style="width:100px;margin-left:20px"></el-input>

            <el-button type="text" style="margin-left:20px" @click="removeStoreInventorySku(i)">删除</el-button>
          </li>
          <li class="addMore" @click="addStoreInventorySku">添加更多</li>
        </ul>
      </div>
    </el-dialog>

    <!-- 批量库存 -->
    <el-dialog title="批量门店库存设置" :visible.sync="showStoreInventoryAll" width="540px">
      <div class="gray_area store_inventory" style="margin-top:0;">
        <ul>
          <li v-for="(item, i) in set_all.store_inventory" :key="i">
            <el-select v-model="item.store_id" filterable placeholder="请选择门店" style="flex:1">
              <el-option v-for="sitem in storeList" :key="sitem.id" :label="sitem.name" :value="sitem.id"></el-option>
            </el-select>

            <el-input v-model="item.total" size="medium" placeholder="库存" style="width:100px;margin-left:20px"></el-input>

            <el-button type="text" style="margin-left:20px" @click="removeStoreInventorySkuAll(i)">删除</el-button>
          </li>
          <li class="addMore" @click="addStoreInventorySkuAll">添加更多</li>
        </ul>
      </div>
      <el-button type="primary" style="margin-top:20px;" @click="setInventoryAll">批量库存</el-button>
    </el-dialog>
  </el-container>
</template>

<script>
import draggable from 'vuedraggable';
import Upload from '@/components/Upload/SingleImage2';
import UploadMulti from '@/components/Upload/uploadMulti';
import Tinymce from '@/components/Tinymce';
import {mapGetters} from 'vuex';
import {getAllProCate, getAllFreight, addPro, editPro, getPro, integralopen} from '@/api/shop/product';
import {getallStore} from '@/api/shop/store';
import {doCombination} from '@/utils/index';
import {objCopy} from '@/utils/index';
import {logintype_byurl, getLoginType} from '@/utils/auth';
import {agent_gradelist} from '@/api/mall/agent';
import {jur_addons_item, jur_addons} from '@/utils/jurisdiction';
import {getMembershipList} from '@/api/mall/vipuser';
import {formtemplatelist} from '@/api/mall/systemform';
export default {
  data() {
    return {
      isCopy: false,
      rk: 1,
      onlyShow: false,
      set_all: {
        original_price: '',
        sell_price: '',
        weight: '',
        total: '',
        store_inventory: [],
        code: '',
        cost_price: ''
      },
      formlist: [],
      LoginType: 'mall',
      MembershipList: [],
      a_id: 0,
      attachlist: [
        // {
        //   name: '颜色',
        //   need: false,
        //   toplimit: 1,
        //   list: [
        //     {
        //       name: '红色',
        //       price: 10,
        //       total: 10
        //     },
        //     {
        //       name: '黑色',
        //       price: 10,
        //       total: 10
        //     }
        //   ]
        // }
      ],
      tabledata: [],
      keylist: [],
      activeName: 'p1',
      isEdit: false,
      showStoreInventory: false,
      showStoreInventoryAll: false,
      classify_id: [],
      currentSku: 0,
      is_base_integral: 0,
      obj: {
        retreat: ['1', '2', '3'],
        name: '', //商品名
        type: 0, //商品类型:0:实体商品,1:虚拟商品
        subtitle: '', //副标题
        master: '', //主图
        cover: false, //是否讲主图添加进轮播图
        slideshow: [], //轮播图
        share: '', //分享图
        classify_id: '', //分类id:1->2->3,1->4,string
        classify_value: '', //分类值:1级->2级->3级,1级->2级1,string
        weight: 0, //重量
        deliver: ['1', '2', '3'], //提取方式:1:快递,2:自提,3:同城
        ft_type: 0, //运费:0:包邮,1:模板,2:统一价格
        ft_id: '', //配送模板id,ft_type=1的时候需要填写
        ft_price: 0, //统一配送价格,ft_type=2的时候需要填写
        total: 0, //总量，库存?
        original_price: 0, //原价
        sell_price: 0, //售价
        code: '', // 商品编码，
        cost_price: 0, // 成本价
        level_price: {
          type: 1,
          price: []
        }, //会员价
        is_original_price: 0, //是否开启原价:0:不开启,1:开启
        integral: 0, //购买获得积分
        is_integral: 1, //是否参与获得积分
        content: '', //商品详情
        sort: 0, //排序
        has_parameter: 0, //是否拥有参数,0:不拥有,1:拥有
        parameter: [], //参数对象
        is_virtual: 0, //是否开启虚拟销量:0:不开启,1:开启
        virtual_sell: 0, //虚拟销量
        is_limitation: 0, //是否开启限购
        limitation: 0, //限购数量
        limitation_type: 1, //限购类型: 1-单笔限购 2-历史限购
        inventory_type: 1, //库存类型:1:下单前减库存,2:永不减库存,3:付款减库存
        label: ['正品保证', '假一赔十', '七天无理由退货'], //标签
        is_distribution: 0, //是否参与分销:0:不参与,1:参与
        is_base_distribution: 0, //启用全局分销配置:0:是,1:不是
        level_price_type: 0, //是否会员商品 0 不参与 2系统默认 1 自定义
        form_open: 0,
        template_id: '',
        has_attach: 0, //是否含有附加属性，0没有1有
        attach_value: [],
        distribution: [
          {
            level: 1,
            type: 0,
            figure: 0
          },
          {
            level: 2,
            type: 0,
            figure: 0
          },
          {
            level: 3,
            type: 0,
            figure: 0
          }
        ], //分销数据
        integral: 0,
        integral_maximum: 0,
        integral_deduction: 0,
        my_integral_deduction: 0,
        has_sku: 0, //是否有sku:0:没有,1:有
        sku_value: [
          {
            name: '颜色',
            attrValue: [
              {
                value: '红色'
              },
              {
                value: '黄色'
              },
              {
                value: '蓝色'
              }
            ],
            has_pic: 0
          },
          {
            name: '尺码',
            attrValue: [
              {
                value: 'L'
              },
              {
                value: 'M'
              },
              {
                value: 'S'
              }
            ],
            has_pic: 0
          }
        ], //sku对象{“1&颜色”:[“1&红色”,”2&白色”],”2&尺码”:[“3&L”,”4&M”]},当has_sku为1时必选
        sku: [
          {
            pvs: '颜色:白色,尺码:L',
            weight: 0,
            inventory: {
              original_price: 0,
              sell_price: 0,
              total: 0
            }, //有sku不开启门店库存下的库存对象(is_store_inventory为0时必选)
            store_sku_inventory: [
              {
                store_id: '',
                original_price: 0,
                sell_price: 0,
                total: 0
              }
            ] //有sku的门店库存对象数组(is_store_inventory为1时必选)
          }
        ], //sku对象数组(当has_sku为1时必选)
        is_store_inventory: 0, //是否开启门店库存,0:不开启，1:开启
        store_inventory: [
          {
            store_id: '',
            total: 0
          }
        ] //没有sku的门店库存对象数组(当has_sku为0,is_store_inventory为1时必选)
      },
      _obj: {},
      inputVisible: false,
      inputValue: '',
      // pageIsEdit:0,//0->新增,1->编辑
      // pageName:'新增商品',
      cateList: [], //分类列表
      freightList: [], //配送模板列表
      storeList: [], //门店列表
      isLoading: false,
      ismall: false,
      isintegralopen: 0,
      isvip: 0,
      itemRules: {
        name: [
          {
            required: true,
            message: '商品名称必须填写'
          }
        ],
        subtitle: [
          {
            required: true,
            message: '商品副标题必须填写'
          }
        ],
        master: [
          {
            required: true,
            message: '主图不能为空'
          }
        ],
        slideshow: [
          {
            required: true,
            message: '轮播图不能为空'
          }
        ],
        classify_id: [
          {
            required: true,
            message: '分类不能为空'
          }
        ]
      },
      gradelist: [],
      page: 1
    };
  },
  components: {
    draggable,
    Upload,
    UploadMulti,
    Tinymce
  },
  computed: {
    ...mapGetters(['agent_rank'])
  },
  created() {
    this.isCopy = this.$route.query.isCopy;
    this.ismall = logintype_byurl() == 'mall';
    this.LoginType = getLoginType(1);
    var _this = this;
    if(this.$route.query.id){
     this.isLoading=true
    }
    jur_addons([11, 16, 20, 23]).then(res => {
      if (!res[11]) {
        _this.obj.deliver = ['1'];
      }
      if (!res[16]) {
        _this.obj.deliver = ['1'];
      }
      if (res[20]) {
        _this.isvip = 1;
        if (_this.ismall) {
          _this.getMembershipList();
        } else {
          _this.getdetail();
        }
      }else{
        _this.getdetail();
      }
      if (res[23] && this.ismall) {
        this.getformlist();
      }
    });

    if (!this.$route.query.id) {
      this.agent_gradelist();
    }
    if (this.$route.query.page) {
      this.page = this.$route.query.page;
    }

    //获取基础数据
    this.getAllProCate();
    this.getAllFreight();
    this.integralopen();
  },
  watch: {
    'obj.cover': function() {
      if (this.obj.cover) {
        this.obj.slideshow.unshift({
          url: this.obj.master,
          name: 'master'
        });
      } else {
        this.obj.slideshow.splice(this.obj.slideshow.findIndex(_ => _.name == 'master'), 1);
      }
    },
    'obj.is_virtual': function() {
      if (!Boolean(this.obj.is_virtual)) {
        this.obj.virtual_sell = 0;
      }
    },
    'obj.has_sku': function() {
      if (Boolean(this.obj.has_sku)) {
        this.formatSkuData();
      }
    },
    'obj.is_store_inventory': function() {
      //if(Boolean(this.obj.is_store_inventory) && Boolean(this.obj.has_sku)){}
    }
  },
  methods: {
    getdetail() {
      if (this.$route.params.onlyShow) {
        //只查看
        this.onlyShow = true;
        this.getPro(this.$route.params.id);
      } else {
        if (this.$route.query.id) {
          //编辑状态
          this.isEdit = true;
          this.getPro(this.$route.query.id);
        } else {
          this._obj = Object.assign({}, this.obj);
        }
      }
    },
    getformlist() {
      formtemplatelist({
        page: 1,
        size: 100,
        source: 1,
        status: 1,
        n_load: 1
      }).then(res => {
        this.formlist = res.msg.data;
      });
    },
    agent_gradelist(distribution) {
      if (!this.ismall) {
        return false;
      }
      let data = {
        page: 1,
        size: 10,
        n_load: 1
      };
      agent_gradelist(data).then(res => {
        let list = res.msg;
        list.unshift({id: 0, name: '默认等级'});
        list.forEach(a => {
          a.distribution = [{type: 0, level: 1, figure: '0'}, {type: 0, level: 2, figure: '0'}, {type: 0, level: 3, figure: '0'}];
          // agent_data.push(a)
        });
        // let d_list = [];
        if (distribution && distribution.length > 0) {
          distribution.forEach(d => {
            if (!Array.isArray(d)) {
              // d_list.push({id: 0, name: '默认等级', distribution: d});
              list[0].distribution = distribution;
            } else {
              debugger;
              let c = d[0];
              let i = list.findIndex(_ => _.id == c[0]);
              if (i > -1) {
                list[i].distribution = d[1];
                // d_list.push({id: c[0], name: c[1], distribution: d[1]});
              } else {
              }
            }
          });
        }

        // let agent_data=[]
        console.log(list)
        this.gradelist = list;
      });
    },
    getMembershipList() {
      getMembershipList(1, 100, {status: 1, n_load: 1}).then(res => {
        console.log(res);
        let MembershipList = res.msg.data;

        MembershipList.forEach(a => {
          console.log(a);
          a.price = 0;
          a.type = 1;
          this.obj.level_price.type = this.obj.level_price_type;
          // this.obj.level_price.price = [];
          this.obj.level_price.price.push({
            price: 0,
            type: 1,
            level: a.level
          });
        });
        console.log(this.obj);
        this.MembershipList = MembershipList;
        this.getdetail()
        console.log(this.obj);
      });
    },
    initlevelprice() {
      let a = [];
      this.MembershipList.forEach(b => {
        a.push({
          price: 0,
          type: 1,
          level: b.level
        });
      });
      let b = {
        type: 0,
        price: a
      };
      return b;
    },
    removeattach(i) {
      this.attachlist.splice(i, 1);
    },
    removeattachitem(i, l) {
      this.attachlist[i].list.splice(l, 1);
    },
    addattach() {
      this.attachlist.push({
        name: '',
        need: 1,
        toplimit: 1,
        list: [
          {
            name: '',
            price: 0,
            total: 0
          }
        ]
      });
    },
    addattachitem(i) {
      this.attachlist[i].list.push({
        name: '',
        price: 0,
        total: 0
      });
    },
    integralopen() {
      integralopen({n_load: 1}).then(res => {
        this.isintegralopen = res.msg;
      });
    },
    handleClose(tag) {
      this.obj.label.splice(this.obj.label.indexOf(tag), 1);
    },

    showInput() {
      this.inputVisible = true;
      this.$nextTick(_ => {
        this.$refs.saveTagInput.$refs.input.focus();
      });
    },

    handleInputConfirm() {
      let inputValue = this.inputValue;
      if (inputValue) {
        this.obj.label.push(inputValue);
      }
      this.inputVisible = false;
      this.inputValue = '';
    },
    //获取所有运费模板
    getAllFreight() {

      getAllFreight({n_load: 1}).then(res => {

        //处理数据
        this.freightList = res.msg;
      });
    },
    //获取所有商品分类
    getAllProCate() {
      getAllProCate({n_load: 1}).then(res => {
        //处理分类数据
        let l = [],
          _l = res.msg.data;
        _l.forEach(e => {
          let o = {};
          (o.value = e.id), (o.label = e.name);
          o.children = [];
          //循环二级
          if (e.children && e.children.length > 0) {
            e.children.forEach(a => {
              let o1 = {};
              o1.value = a.id;
              o1.label = a.name;
              o1.children = [];
              o.children.push(o1);
              //循环三级
              if (a.children && a.children.length > 0) {
                a.children.forEach(x => {
                  o1.children.push({
                    value: x.id,
                    label: x.name
                  });
                });
              }
            });
          }
          l.push(o);
        });
        this.cateList = l;
      });
    },
    //获取所有门店数据
    getAllStore() {
      getallStore().then(res => {
        this.storeList = res.msg;
        if (this.storeList == 0) {
          this.obj.deliver = ['1'];
        }
      });
    },
    //增加门店库存设置条数
    addStoreInventory() {
      this.obj.store_inventory.push({
        store_id: '',
        total: 0
      });
    },
    //删除门店库存设置条数
    removeStoreInventory(i) {
      this.obj.store_inventory.splice(i, 1);
    },
    //刷新运费模板
    refreshFreight() {
      this.getAllFreight();
    },
    //获取商品原始数据
    getPro(id) {
      let data = {
        id: id,
        n_load: 1
      };
      getPro(id,data)
        .then(res => {
          let o = res.msg;
          let max = Number(o.integral_maximum);
          if (o.integral_deduction == 1) {
            if (max == 0) {
              o.my_integral_deduction = 1;
            } else {
              o.my_integral_deduction = 2;
            }
          } else {
            o.my_integral_deduction = 0;
          }
          if (o.integral > 0 && o.is_integral) {
            this.is_base_integral = 1;
          } else {
            this.is_base_integral = 0;
          }
          o.total = o.total - o.sell;
          if (o.retreat) {
            o.retreat = o.retreat.split(',');
          } else {
            o.retreat = [];
          }
          if (o.deliver) {
            o.deliver = o.deliver.split(',');
          } else {
            o.deliver = [];
          }
          // o.level_price=[]
          if (o.level_price) {
            console.log(o.level_price);
            let newprice = [];
            this.MembershipList.forEach(a => {
              let i = o.level_price.price.findIndex(_ => _.level == a.level);

              if (i > -1) {
                let b = o.level_price.price[i];
                newprice.push({level: b.level, price: b.price, type: b.type});
              } else {
                newprice.push({level: a.level, price: 0, type: 1});
              }
            });
            o.level_price.price = newprice;
            // this.MembershipList.forEach((c, i) => {
            //
            //   if(a==-1){
            //      o.level_price.price.push({level: c.level, price: 0, type: 1});
            //   }
            //   // if (!o.level_price.price[i]) {

            //   // }
            // });
            // o.level_price = JSON.parse(o.level_price);
          } else {
            o.level_price = this.initlevelprice();

            // o.level_price=[]
          }
          if (o.has_sku) {
            o.sku.forEach(a => {
              if (a.inventory.level_price) {
                if (typeof a.inventory.level_price == 'string') {
                  a.inventory.level_price = JSON.parse(a.inventory.level_price);
                }

                this.MembershipList.forEach((d, n) => {
                  let i = a.inventory.level_price.price.findIndex(_ => _.level == d.level);
                  if (i == -1) {
                    console.log(i);
                    a.inventory.level_price.price.splice(n, 0, {level: d.level, price: 0, type: 1});
                    console.log(a.inventory.level_price.price);
                    // a.inventory.level_price.price.push({level: c.level, price: 0, type: 1});
                  }
                });

                o.level_price_type = a.inventory.level_price.type;
              }
            });
          } else {
            o.level_price_type = o.level_price.type;
          }
          if (o.has_attach && o.attach_value) {
            o.attach_value.forEach(a => {
              let list = [];
              a.attrValue.forEach(v => {
                list.push({
                  name: v[1],
                  price: v[2],
                  total: v[4],
                  id: v[0],
                  sell: v[3] - v[4]
                });
              });
              this.attachlist.push({
                id: a.id,
                name: a.name,
                need: a.need,
                toplimit: a.toplimit,
                list: list
              });
            });
          }
          this.agent_gradelist(o.distribution);
          objCopy(this.obj, o);
          //转换类别数据
          let c = [];
          c = o.classify_id.split(',');
          c.forEach((e, i) => {
            c[i] = c[i].split('->');
          });
          this.classify_id = c;
          this.isLoading=false
        })
        .catch(e => {
          this.isLoading = false;
        });
    },
    async Validate() {
      var str = false;
      // let i=this.obj.sku_value.findIndex(_=>{
      //     return _.attrValue.findIndex(b=>b.name=='')>-1
      // })
      // console.log(i)
      // return false
      this.obj.sku_value.forEach(a => {
        a.attrValue.forEach(b => {
          if (!b.value) {
            str = '规格"' + b.name + '"有子规格项未填写';
          }
        });
      });
      this.obj.sku.forEach(a => {
        if (!a.inventory.sell_price) {
          str = '规格"' + a.pvs + '"售价不能为空';
          return;
        }
        if (!a.inventory.original_price) {
          str = '规格"' + a.pvs + '"原价不能为空';
          return;
        }
        if (a.inventory.total === '') {
          str = '规格"' + a.pvs + '"库存不能为空';
          return;
        }
      });
      this.attachlist.forEach(a => {});
      return str;
    },
    //保存数据
    async saveData() {
      //封装类别数据(id)
      let cid = '';
      this.classify_id.forEach(e => {
        cid += e.join('->') + ',';
      });
      this.obj.classify_id = cid.substring(0, cid.length - 1);
      //封装类别数据(value)
      let cval = this.$refs['cateCal'].getCheckedNodes(),
        s = '';
      cval.forEach(e => {
        s += e.label;
        s += ',';
      });
      this.obj.classify_value = s.substring(0, s.length - 1);

      //封装SKU数据
      let li = [];

      this.tabledata.forEach(e => {
        let o = {};
        o.pvs = '';
        for (let i = 0, l = this.keylist.length; i < l; i++) {
          if (this.keylist[i] != '图片') {
            o.pvs += this.keylist[i] + ':' + e['k' + i] + ',';
          }
        }
        //生成pvs参数
        o.pvs = o.pvs.substring(0, o.pvs.length - 1);
        o.weight = e.weight;
        o.pic = e.pic;
        o.id = e.pid;

        //生成具体价格参数
        if (this.obj.is_store_inventory) {
          //开启门店库存功能(功能废弃)
          o.store_sku_inventory = [];
          e.store_inventory.forEach(x => {
            o.store_sku_inventory.push({
              store_id: x.store_id,
              original_price: e.original_price,
              sell_price: e.sell_price,
              //total:x.total,
              total: this.isEdit ? parseInt(e.total) + parseInt(e.sell) : e.total
            });
          });
        } else {
          console.log(this.obj.level_price_type);
          e.level_price.type = this.obj.level_price_type;
          o.code = e.code;
          o.inventory = {
            original_price: e.original_price,
            sell_price: e.sell_price,
            id: e.id,

            cost_price: e.cost_price,
            sku_id: e.sku_id,
            level_price: JSON.stringify(e.level_price),
            total: this.isEdit && !this.isCopy ? parseInt(e.total) + parseInt(e.sell || 0) : e.total
          };
        }
        li.push(o);
      });

      let attach_value = [];
      let attach_value_text = [];
      let is_attach = true;
      this.attachlist.forEach(a => {
        let list = [];
        a.list.forEach(v => {
          let attach = a.name + ':' + v.name;
          if (attach_value_text.indexOf(attach) == -1) {
            attach_value_text.push(attach);
          } else {
            this.$alert(attach + '重复！');
            is_attach = false;
          }
          let l = [];
          if (v.id && !this.isCopy) {
            l.push(v.id);
          }
          l.push(v.name);
          l.push(v.price);
          if (v.sell && this.isEdit && !this.isCopy) {
            let total = Number(v.total) + Number(v.sell);
            l.push(total);
          } else {
            l.push(v.total);
          }

          list.push(l);
        });
        let data = {
          name: a.name,
          toplimit: a.toplimit,
          need: a.need,
          attrValue: list
        };
        if (a.id && !this.isCopy) {
          data.id = a.id;
        }
        attach_value.push(data);
      });
      if (!is_attach) {
        return false;
      }
      //赋值sku数据
      this.obj.total = this.isEdit && !this.isCopy ? parseInt(this.obj.total) + parseInt(this.obj.sell || 0) : this.obj.total;
      this.obj.sku = li;
      if (this.obj.has_sku) {
        let str = await this.Validate();
        if (str) {
          this.$alert(str);
          return false;
        }
      }
      this.$refs.shForm.validate(valid => {
        if (valid) {
          if (this.obj.ft_type == 1) {
            if (!this.obj.ft_id) {
              this.$alert('请选择运费模板');
              this.activeName = 'p1';
              return false;
            }
          }
          if (this.obj.content == '') {
            this.$alert('商品详情不能为空');
            this.activeName = 'p2';
            return false;
          }

          //营销数据
          this.obj.integral_maximum = Number(this.obj.integral_maximum);
          if (this.obj.my_integral_deduction == 2) {
            this.obj.integral_deduction = 1;
            if (!this.obj.integral_maximum) {
              this.$alert('请输入最大抵扣金额');
              return false;
            }
          }

          if (this.obj.my_integral_deduction == 1) {
            this.obj.integral_deduction = 1;
            this.obj.integral_maximum = 0;
          }
          if (this.obj.my_integral_deduction == 0) {
            this.obj.integral_deduction = 0;
            this.obj.integral_maximum = 0;
          }
          if (!this.is_base_integral) {
            this.obj.integral = 0;
          }
          if (!this.obj.has_sku) {
            this.obj.level_price.type = this.obj.level_price_type;
            this.obj.level_price = JSON.stringify(this.obj.level_price);
          }
          let distribution = [];
          this.gradelist.forEach(a => {
            let d = [a.id, a.name];
            let c = [d, a.distribution];
            distribution.push(c);
          });
          this.obj.distribution = distribution;
          this.obj.retreat = this.obj.retreat.join(',');
          this.obj.deliver = this.obj.deliver.join(',');
          this.obj.attach_value = attach_value;
          //提交数据
          delete this.obj.cover;
          delete this.obj.my_integral_deduction;
          delete this.obj.level_price_type;
          if (this.isCopy) {
            delete this.obj.id;
            delete this.obj.status;
            delete this.obj.status_text;
            delete this.obj.update_time;
            delete this.obj.create_time;
            delete this.obj.delete_time;
            delete this.obj.sell;
            this.obj.sku_value.forEach(item => {
              delete item.id;
              item.attrValue.forEach(itemr => {
                delete itemr.id;
                delete itemr.pid;
              });
            });
            this.obj.sku.forEach(item => {
              delete item.id;
              delete item.inventory.id;
              delete item.inventory.sku_id;
            });

            addPro(this.obj).then(res => {
              this.$router.push({path: '/product/list/sell', query: {page: this.page}});
            });
          } else {
            if (this.isEdit) {
              editPro(this.obj).then(res => {
                this.$router.push({path: '/product/list/sell', query: {page: this.page}});
              });
            } else {
              addPro(this.obj).then(res => {
                this.$router.push({path: '/product/list/sell', query: {page: this.page}});
              });
            }
          }
        } else {
          //校验没通过
          return false;
        }
      });
    },
    //tab标签点击
    tabsClick() {
      //no code
    },
    //获取主图
    getImage(val) {
      this.obj.master = val;
    },
    //获取分享图
    getImageShare(val) {
      this.obj.share = val;
    },
    //获取Sku图片
    getSkuImage(val, key, index) {
      // console.log(key)
      // console.log(index)
      // console.log(this.tabledata)
      //this.tabledata[index]['k' + key] = val;
      //处理图片
      let i = this.obj.sku_value.findIndex(_ => _.has_pic == 1);
      //console.log(i)
      //console.log(this.tabledata)
      this.tabledata[index].pic = val;
      let x = this.tabledata[index];
      switch (i) {
        case 0:
          //第一项存在图片
          this.tabledata
            .filter(_ => {
              return _.k0 == x.k0;
            })
            .forEach(e => {
              e.pic = x.pic;
            });
          break;
        case 1:
          //第二项存在图片
          this.tabledata
            .filter(_ => {
              return _.k0 == x.k0 && _.k1 == x.k1;
            })
            .forEach(e => {
              e.pic = x.pic;
            });
          break;
        case 2:
          //第三项存在图片
          this.tabledata
            .filter(_ => {
              return _.k0 == x.k0 && _.k1 == x.k1 && _.k2 == x.k2;
            })
            .forEach(e => {
              e.pic = x.pic;
            });
          break;
        default:
          //empty
          break;
      }
    },
    //启用SKU图片
    usePic(index) {
      this.obj.sku_value.forEach((e, i) => {
        if (i != index) {
          e.has_pic = 0;
        }
      });
      this.formatSkuData();
    },
    //批量设置门店库存
    buildStoreNumAll() {
      this.showStoreInventoryAll = true;
    },
    //设置门店库存
    buildStoreNum(item) {
      //console.log(item)
      this.showStoreInventory = true;
      this.currentSku = item.$index;
    },
    //SKU批量设置参数
    setAll() {
      this.tabledata.forEach(e => {
        //批量设置划线价
        if (this.set_all.original_price) {
          e.original_price = this.set_all.original_price;
        }
        //批量设置销售价
        if (this.set_all.sell_price) {
          e.sell_price = this.set_all.sell_price;
        }
        //批量设置重量
        if (this.set_all.weight) {
          e.weight = this.set_all.weight;
        }
        //批量设置库存
        if (this.set_all.total) {
          e.total = this.set_all.total;
        }
        if (this.set_all.code) {
          e.code = this.set_all.code;
        }
        if (this.set_all.cost_price) {
          e.cost_price = this.set_all.cost_price;
        }
      });
    },
    setAlllevelprice() {
      this.tabledata.forEach(e => {
        e.level_price.price[this.a_id].price = this.MembershipList[this.a_id].price;
        e.level_price.price[this.a_id].type = this.MembershipList[this.a_id].type;
        // e.level_price.price.forEach((a, i) => {
        //   a.price = this.MembershipList[i].price;
        //   a.type = this.MembershipList[i].type;
        //   // a.level = this.MembershipList[i].level;
        // });
      });
    },
    //确定批量设置库存
    setInventoryAll() {
      this.tabledata.forEach(e => {
        e.store_inventory = [];
        this.set_all.store_inventory.forEach(o => {
          e.store_inventory.push(o);
        });
      });
      this.showStoreInventoryAll = false;
    },
    //增加SKU门店库存设置条数(批量)
    addStoreInventorySkuAll() {
      this.set_all.store_inventory.push({
        store_id: '',
        total: 0
      });
    },
    //增加SKU门店库存设置条数
    addStoreInventorySku() {
      this.tabledata[this.currentSku].store_inventory.push({
        store_id: '',
        total: 0
      });
    },
    //删除SKU门店库存设置条数(批量)
    removeStoreInventorySkuAll(i) {
      this.set_all.store_inventory.splice(i, 1);
    },
    //删除SKU门店库存设置条数
    removeStoreInventorySku(i) {
      this.tabledata[this.currentSku].store_inventory.splice(i, 1);
    },
    //添加SKU项
    addSkuItem() {
      this.obj.sku_value.push({
        name: '',
        attrValue: [{}],
        has_pic: 0
      });
      this.formatSkuData();
    },
    //删除SKU项
    removeSkuItem(i) {
      this.obj.sku_value.splice(i, 1);
      this.formatSkuData();
    },
    //添加SKU值
    addSkuValue(i) {
      this.obj.sku_value[i].attrValue.push({
        value: ''
      });
      this.formatSkuData();
      console.log(this.tabledata);
    },
    //删除SKU值
    removeSkuValue(i, l) {
      if (this.obj.sku_value[i].attrValue.length > 1) {
        this.obj.sku_value[i].attrValue.splice(l, 1);
        this.formatSkuData();
      }
    },
    //初始化SKU数据
    formatSkuData() {
      this.rk++;
      let sl = this.obj.sku_value,
        list = [],
        keylist = [];
      //查询出启用pic的sku_item下标
      let index = sl.findIndex(e => e.has_pic == true);

      sl.forEach((e, i) => {
        keylist.push(e.name);
        //预处理attrValue数据,添加sku的key值以及父ID
        e.attrValue.forEach(ee => {
          ee.name = e.name;
          ee.pid = e.id;
        });

        list.push(e.attrValue);
        if (i == index) {
          keylist.push('图片');
          list.push([
            {
              value: ''
            }
          ]);
        }
      });

      this.keylist = keylist;

      let alist = doCombination(list);
      //console.log(alist)

      let t = [];
      alist.forEach((e, i) => {
        let o = {};
        // for(let i=0,l=this.obj.sku_value.length;i<l;i++){
        //   let d = 'k' + i;
        //   o[d] = e[i].value ? e[i].value : '#';
        // };
        for (let i = 0, l = this.keylist.length; i < l; i++) {
          let d = 'k' + i;
          if (this.keylist[i] == '图片') {
            o[d] = e[i].value ? e[i].value : '';
          } else {
            o[d] = e[i].value ? e[i].value : '#';
          }
        }

        //添加参数
        if (this.$route.query.id) {
          //编辑状态
          if (this.obj.has_sku) {
            if (this.obj.is_store_inventory) {
              //开启门店库存（循环数据全部取0下表,可能会有错,库存暂时已搁置,此问题先不研究）
              //o.cost_price = this.obj.sku[i] != undefined ? this.obj.sku[i].storeSkuInventory[0].cost_price : 0;
              o.weight = this.obj.sku[i] != undefined ? this.obj.sku[i].weight : 0;
              o.original_price = this.obj.sku[i] != undefined ? this.obj.sku[i].storeSkuInventory[0].original_price : 0;
              o.sell_price = this.obj.sku[i] != undefined ? this.obj.sku[i].storeSkuInventory[0].sell_price : 0;
              o.total = this.obj.sku[i] != undefined ? this.obj.sku[i].storeSkuInventory[0].total : 0;
              o.store_inventory = this.obj.sku[i] != undefined ? this.obj.sku[i].storeSkuInventory : [];
              o.pic = this.obj.sku[i] != undefined ? this.obj.sku[i].pic : '';
              //实时库存
              o.tsum = this.obj.sku[i] != undefined ? this.obj.sku[i].total - this.obj.sku[i].sell : 0;
            } else {
              o.weight = 0;
              o.original_price = 0;
              o.sell_price = 0;
              o.code = '';
              o.cost_price = 0;
              o.total = 0;
              o.store_inventory = [];
              o.pic = '';
              o.level_price = this.initlevelprice();
              //o.cost_price = this.obj.sku[i].inventory.sell_price;
              //定位数据
              let tls = [],
                s = '';
              tls = e.filter(_ => {
                return _.value != '';
              });
              //拼装标志
              tls.forEach(e => {
                s += e.pid + ':' + e.id + ',';
              });
              s = s.substring(0, s.length - 1);

              //定位
              let target = this.obj.sku.filter(_ => {
                return _.pvs == s;
              });
              console.log(target);
              if (target.length > 0) {
                o.weight = target[0].weight;
                o.original_price = target[0].inventory.original_price;
                o.sell_price = target[0].inventory.sell_price;
                //o.total = target[0].inventory.total;
                o.total = target[0].inventory.total - target[0].inventory.sell;
                o.sell = target[0].inventory.sell;
                o.code = target[0].code;
                o.cost_price = target[0].inventory.cost_price;

                o.store_inventory = [];
                o.pic = target[0].pic;
                if (target[0].inventory.level_price) {
                  o.level_price = target[0].inventory.level_price;
                } else {
                  o.level_price = this.initlevelprice();
                }
                console.log(o);
                o.pid = target[0].id;
                o.id = target[0].inventory.id;
                o.sku_id = target[0].inventory.sku_id;

                //实时库存
                o.tsum = target[0].inventory.total - target[0].inventory.sell;
              }
            }
          }
        } else {
          //o.cost_price = 0;
          o.weight = 0;
          o.original_price = 0;
          o.sell_price = 0;
          o.total = 0;
          o.code = '';
          o.cost_price = 0;
          o.store_inventory = [];
          o.pic = '';
          o.level_price = {type: this.obj.level_price_type, price: []};
          this.MembershipList.forEach(a => {
            o.level_price.price.push({level: a.level, price: 0, type: 1});
          });
        }

        t.push(o);
      });

      console.log(t);
      this.tabledata = t;
    },
    //表格合并功能计算函数
    arraySpanMethod({row, column, rowIndex, columnIndex}) {
      switch (this.obj.sku_value.findIndex(e => e.has_pic == true)) {
        case 0:
          if (columnIndex === 0 || columnIndex === 1) {
            let d = this.obj.sku_value[1] ? this.obj.sku_value[1].attrValue.length : 1;

            if (this.obj.sku_value[2] && this.obj.sku_value[2].attrValue) {
              d = d * this.obj.sku_value[2].attrValue.length;
            }

            if (rowIndex % d === 0) {
              return {
                rowspan: d,
                colspan: 1
              };
            } else {
              return {
                rowspan: 0,
                colspan: 0
              };
            }
          } else if (columnIndex === 2) {
            let d = this.obj.sku_value[2] ? this.obj.sku_value[2].attrValue.length : 1;

            if (rowIndex % d === 0) {
              return {
                rowspan: d,
                colspan: 1
              };
            } else {
              return {
                rowspan: 0,
                colspan: 0
              };
            }
          }
          break;
        case 1:
          if (columnIndex === 0) {
            let d = this.obj.sku_value[1] ? this.obj.sku_value[1].attrValue.length : 1;

            if (this.obj.sku_value[2] && this.obj.sku_value[2].attrValue) {
              d = d * this.obj.sku_value[2].attrValue.length;
            }

            if (rowIndex % d === 0) {
              return {
                rowspan: d,
                colspan: 1
              };
            } else {
              return {
                rowspan: 0,
                colspan: 0
              };
            }
          } else if (columnIndex === 1 || columnIndex === 2) {
            let d = this.obj.sku_value[2] ? this.obj.sku_value[2].attrValue.length : 1;

            if (rowIndex % d === 0) {
              return {
                rowspan: d,
                colspan: 1
              };
            } else {
              return {
                rowspan: 0,
                colspan: 0
              };
            }
          }
          break;
        case 2:
        default:
          if (columnIndex === 0) {
            let d = this.obj.sku_value[1] ? this.obj.sku_value[1].attrValue.length : 1;

            if (this.obj.sku_value[2] && this.obj.sku_value[2].attrValue) {
              d = d * this.obj.sku_value[2].attrValue.length;
            }

            if (rowIndex % d === 0) {
              return {
                rowspan: d,
                colspan: 1
              };
            } else {
              return {
                rowspan: 0,
                colspan: 0
              };
            }
          } else if (columnIndex === 1) {
            let d = this.obj.sku_value[2] ? this.obj.sku_value[2].attrValue.length : 1;

            if (rowIndex % d === 0) {
              return {
                rowspan: d,
                colspan: 1
              };
            } else {
              return {
                rowspan: 0,
                colspan: 0
              };
            }
          }
          break;
      }
    },
    //添加参数条数
    addParameter() {
      this.obj.parameter.push({
        key: '',
        value: ''
      });
    },
    //删除参数条数
    removeParameter(i) {
      this.obj.parameter.splice(i, 1);
    }
  }
};
</script>

<style lang="scss" scoped>

.el-tag + .el-tag {
  margin-left: 10px;
}
.button-new-tag {
  margin-left: 10px;
  height: 32px;
  line-height: 30px;
  padding-top: 0;
  padding-bottom: 0;
}
.input-new-tag {
  width: 90px;
  margin-left: 10px;
  vertical-align: bottom;
}
//穿透样式,解决样式无法对齐的bug
::v-deep .el-checkbox .el-checkbox__label {
  vertical-align: middle;
}

::v-deep .el-table tbody tr:hover > td {
  background-color: #fff !important;
  color: #000 !important;
}
.radio_icon {
  font-size: 17px;
  margin-left: 5px;
}
.radio_icon_img {
  width: 40px;
  height: 40px;
  position: absolute;
  top: -11px;
  margin-left: 5px;
  // background: url("@/assets/images/tuijian.png") no-repeat center center;
}
.inventory {
  .el-radio {
    position: relative;
    margin-right: 50px;
  }
}

.proAdd {
  // height:calc(100vh - 36px);
  padding-bottom: 0;

  //主体样式
  .list_con {
    display: flex;
    flex-direction: column;
    // height: 100%;
    padding-bottom: 0;
    height:100%;

    .lcc {
      flex: 1;
      overflow-y: auto;
      height: 0;
      position: relative;
    }

    .edit_footer {
      height: 60px;
      line-height: 60px;
      box-sizing: border-box;
      flex: 0;
      bottom: 0;
      z-index: 10;
      border-top: 1px solid #dcdfe6;
      text-align: center;
    }
  }

  //公共灰色区域样式
  .gray_area {
    background: #f4f6f8;
    margin-top: 10px;
    padding: 20px;

    &.store_inventory {
      width: 500px;
    }
  }

  //设置商店库存样式
  .store_inventory {
    width: 600px;

    ul {
      li {
        display: flex;
        border-top: 1px solid #dcdfe6;
        padding: 20px 0;

        &:first-child {
          border-top: 0;
          padding-top: 0;
        }

        &.addMore {
          padding-top: 10px;
          padding-bottom: 0;
          justify-content: center;
          color: #1890ff;
          cursor: pointer;
        }
      }
    }
  }

  //设置SKU样式
  .sku_attr {
    .attr_bk {
      border-bottom: 1px solid #dcdfe6;
      padding-top: 20px;
      position: relative;

      .icon-abl-close-bk {
        position: absolute;
        z-index: 1;
        font-size: 20px;
        right: 0;
        top: 20px;
        cursor: pointer;
        color: #909399;
        display: none;
      }

      &:first-child {
        padding-top: 0;
      }

      &.addBk {
        padding-bottom: 20px;
        color: #2e68ea;
        cursor: pointer;
        text-align: center;
      }

      &:hover {
        .icon-abl-close-bk {
          display: block;
        }
      }

      .attr_name {
        //no css
      }

      .attr_list {
        display: flex;
        padding: 0 0 20px 50px;
        position: relative;

        .line {
          position: absolute;
          top: 18px;
          left: 20px;
          width: 20px;
          height: 20px;
          border: 1px solid #b8b9bd;
          border-top: none;
          border-right: none;
        }

        ul {
          display: flex;
          flex-wrap: wrap;

          li {
            position: relative;
            margin-right: 20px;
            margin-top: 20px;

            .icon-abl-close {
              position: absolute;
              z-index: 1;
              font-size: 20px;
              right: -10px;
              top: -10px;
              cursor: pointer;
              color: #909399;
              display: none;

              &:hover {
                color: #606266;
              }
            }

            &.addItem {
              color: #2e68ea;
              cursor: pointer;
            }

            &:hover {
              .icon-abl-close {
                display: block;
              }
            }
          }
        }
      }
    }
  }

  .sku_num_all {
    background: #fff;
    display: flex;
    margin-top: 20px;
    padding: 20px 0;

    .l_title {
      width: 100px;
      margin-right: 20px;
      text-align: right;
    }
  }

  .sku_set {
    margin-top: 20px;
    background: #fff;

    // .sku_header{
    //   border-bottom: 1px solid #DCDFE6;

    //   th{
    //     padding: 5px 0;
    //   }
    // }

    // .sku_body{
    //   tr{
    //     td{
    //       padding: 10px;
    //       text-align: center;
    //       border-bottom: 1px solid #DCDFE6;
    //     }

    //   }
    // }
  }

  //商品参数样式
  .proPrams {
    width: 800px;
    box-shadow: 0px 2px 9px 0px rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    dl {
      width: 100%;
      border: 1px solid #dcdfe6;

      dt {
        display: flex;
        border-bottom: 1px solid #dcdfe6;
        height: 40px;
        line-height: 40px;
        background: #f4f6f8;
        font-weight: 700;

        .dks {
          &.drag {
            width: 30px;
            text-align: center;
            font-size: 16px;
          }

          &.ins {
            flex: 1;
            padding-right: 15px;
          }

          &.cbs {
            width: 50px;
          }
        }
      }

      dd {
        display: flex;
        padding: 10px 0;
        margin: 0;
        border-bottom: 1px solid #dcdfe6;

        &.ap {
          border-bottom: 0;
          text-align: center;
        }

        // &:last-child{
        //   border-bottom: 0;
        // }

        .dks {
          &.drag {
            cursor: pointer;
            width: 30px;
            text-align: center;
            font-size: 16px;
          }

          &.ins {
            flex: 1;
            padding-right: 15px;
          }

          &.cbs {
            width: 50px;
          }
        }
      }
    }
  }

  //分销样式
  .distribution {
    width: 1000px;
    box-sizing: border-box;
    padding: 0px;
    box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.1);
    border-radius: 6px;
    overflow: hidden;
    .el-select .el-input {
      width: 110px;
    }

    .setting_area {
      background: #fff;
      &:first-child {
        background: #edf0f3;
      }
      ::v-deep .el-input-group__append {
        background: #fff !important;
        border-left: none;
      }
      ::v-deep.el-input-group__prepend {
        background: #fff;
      }
      display: flex;
      border-bottom: 1px solid #dcdfe6;

      &:last-child {
        border-bottom: 0;
      }

      .setStyle {
        flex: 1;
        padding: 20px 10px;
        display: flex;
        position: relative;
        &:first-child {
          flex: 0 1 auto;
          width: 100px;
          text-align: center;
        }
        .el-input {
          margin-left: 20px;
          width: 120px;
        }
        > span {
          position: absolute;
          right: 53px;
        }
        &.tc {
          text-align: center;
        }
      }
    }
  }
  //灰色框
  .fks {
    background: #f4f6f8;
    //width: 500px;
    padding: 20px;
    color: #606266;
  }
}
</style>
<style lang="scss">
.detial_div {
  display: flex;
  .title {
    text-align: center;
    display: block;
    margin: 10px 0;
  }
  .content_div {
    border: 1px solid #f5f2f0;
    margin-right: 25px;
    width: 375px;
    height: 600px;
    overflow-y: scroll;
    p {
      margin: 0;
    }
    img {
      width: 100%;
      display: block;
    }
  }
  .tinymce-container {
    width: calc(100% - 400px) !important;
  }
}
.attach {
  background: #f4f6f8;
  padding: 20px;
  margin-bottom: 20px;
  position: relative;
  .icon-abl-close {
    position: absolute;
    z-index: 1;
    font-size: 20px;
    right: -10px;
    top: -10px;
    cursor: pointer;
    color: #909399;
    display: none;

    &:hover {
      color: #606266;
    }
  }

  &:hover {
    .icon-abl-close {
      display: block;
    }
  }
  > .u-flex {
    margin-bottom: 20px;
  }
  .u-label {
    width: 60px;
    text-align: right;
    margin-right: 10px;
  }
  .el-input {
    width: 180px;
    margin-right: 20px;
  }
  .toplimit {
    span {
      color: #7f7f7f;
      // margin-right: 20px;
    }
    .el-input-number {
      width: 100px;
      margin-right: 20px;
      margin-left: 10px;
    }
    .el-input {
      width: 100px;
    }
  }
}
.member_price {
  display: flex;
  margin-bottom: 10px;
  .member_title {
    width: 110px;
    margin-right: 10px;
  }
  .member_input {
    // width: 270px;
  }
  .member_input_long {
    width: 360px;
  }
}
.input-with-select {
  width: 180px;
}
</style>
